<!--数据字典管理-->
<template>
  <div>
    <a-card>
      <p slot="title">
        检索条件
      </p>
      <div class="formSearch">
        <a-form ref="acDTO" :label-width="80" layout="inline"
                @keydown.native.enter.prevent="handleSubmit">
          <a-form-item label="实验室名称：" prop="searchKey">
            <a-input v-model="name" placeholder="请输入实验室名称搜索"
                     @keyup="formatEnterContent(name)"
                     @blur="formatEnterContent(name)" style="width: 220px">
              <a-icon slot="prefix" type="user" class="displayPre" />
              <a-icon v-if="name" slot="suffix" type="close-circle" @click="emitEmpty(name)" />
            </a-input>
          </a-form-item>
          <a-form-item label="审批状态：" prop="userName" style="margin-right: 25px;">
            <a-select style="width: 350px"
                      placeholder="全部" v-model="applyType">
              <a-select-option v-for="item in applyTypeList" :value="item.value"
                               :key="item.value">{{item.label }}
              </a-select-option>
            </a-select>
          </a-form-item>
          <a-button type="primary" @click="handleSubmit"
                    >查询
          </a-button>
          <a-button style="margin-left: 8px" @click="reStore">重置</a-button>
        </a-form>
      </div>
    </a-card>
    <div style="height: 10px"></div>
    <div class="commonStyle nyContent">
      <div class="table-operator" v-if="hasPermission ('ac:save')">
        <a-button type="primary"  @click="addAc" >新增</a-button>
      </div>
      <a-table :columns="columns" :dataSource="acManagePageData" :rowKey="record => record.recordId"
               :pagination="false">
                <span slot="index" slot-scope="text, record, index">
                    {{ (page.currentPage - 1) * page.pageSize + index + 1 }}
                </span>
        <span slot="state" slot-scope="text, record, index"
              :style="{color:renderStateColor(text)}">

                    {{ renderState(text)}}
                </span>
        <span slot="applyTime" slot-scope="text, record, index">
                    {{record.startTime+' - '+ record.endTime}}
                </span>
        <span slot="refuseReason" slot-scope="text, record, index">
                    {{text === '0'?"":(text === '1'?"审批通过":record.refuseReason)}}
                </span>
        <span slot="operation" slot-scope="text, record, index" class="table-operation">
          <a @click="editAcDTO(record)" v-if="record.state === '0' && hasPermission ('ac:save')">
                            编辑</a>
          <a @click="deleteAc(record)" v-if="record.state === '0' && hasPermission ('ac:delete')">
                                          删除</a>
          <a @click="approveAc(record)" v-if="record.state === '0' && hasPermission ('ac:approve')">
                                          审批</a>
                </span>
      </a-table>
      <Page :totalCount="pageVal.total" :currentPage="pageVal.currentPage" ref="page"
            :pageSize="pageVal.pageSize" @changePage="changePage" @changePageSize="changePageSize" />
    </div>
    <add-edit ref="addEdit"
              :title="title"
              :auth="false"
              :acDTO="acDTO" @init="init" />
    <approve-ac ref="approveAc"
              :acDTO="acDTO" @init="init" />
  </div>
</template>

<script>
import addEdit from './addEdit.vue'
import { mapState } from 'vuex'
import Page from 'module/pagination'
import Util from '@/libs/util';
import moment from 'moment'
import ApproveAc from "@/views/lab/acManage/approveAc.vue";
export default {
  name: 'acManage',
  components: {
    ApproveAc,
    addEdit,
    Page,
  },
  data () {
    return {
      title: true,
      applyTypeList: [
        {label:"审批中",value:"0"},
        {label:"已通过",value:"1"},
        {label:"驳回",value:"2"},
      ],
      name: '',
      applyType: '',
      startValue: null,
      endValue: null,
      acDTO: {
        recordId: '',
        name: '',
        buildName: '',
        buildCode: '',
        roomCode: '0',
        diskNum: '',
      },
      page: {
        currentPage: 1,
        pageSize: 10
      },
      columns: [
        {title: '序号', key: 'index', width: '8%', align: 'center', scopedSlots: {customRender: 'index'}},
        {title: '实验室名称', dataIndex: 'laboratory', key: 'laboratory', width: '10%'},
        {title: '申请人', dataIndex: 'name', key: 'name', width: '8%'},
        {title: '申请时间段', dataIndex: 'applyTime', key: 'applyTime',width:'10%',scopedSlots: {customRender: 'applyTime'}},
        {title: '申请原因', dataIndex: 'useTo', key: 'useTo'},
        {title: '申请状态', dataIndex: 'state', key: 'state', width: '150px',scopedSlots: {customRender: 'state'}},
        {title: '审批时间', dataIndex: 'approveTime', key: 'approveTime', width: '10%'},
        {title: '审批人', dataIndex: 'approvePersion', key: 'approvePersion', width: '10%'},
        {title: '审批说明', dataIndex: 'refuseReason', key: 'refuseReason', width: '10%',scopedSlots: {customRender: 'refuseReason'}},
        {title: '操作', dataIndex: 'operation',width: '15%', key: 'operation',scopedSlots: {customRender: 'operation'}},
      ],
    }
  },
  computed: {
    acManagePageData () {
      return this.$store.state.acManage.acManagePageData
    },
    ...mapState ({
      pageVal: state => state.acManage.page,
    }),

  },
  filters: {
    filterWord(value, list) {
      for (let i=0; i<list.length; i++) {
        if (value === list[i].value) {
          return list[i].label
        }
      }
    },
  },
  methods: {
    emitEmpty () {
      this.name = ''
      this.init ()
    },
    reStore(){
      this.name = ''
      this.applyType = ''
      this.startValue = null
      this.endValue = null
      this.page.currentPage = 1
      this.init();
    },

    editAcDTO(acObj){
      this.acDTO = {...acObj}
      this.title = false
      this.$refs.addEdit.showEdit(this.acDTO)
    },
    addAc(){
      this.clearAcDTO ()
      this.title = true
      this.$refs.addEdit.showModal ()
    },
    clearAcDTO(){
      this.acDTO= {
        recordId: '',
            name: '',
            buildName: '',
            buildCode: '',
            roomCode: '0',
            diskNum: '',
      }
    },
    renderState(state){
      let stateText = ''
      switch (state){
        case '0':
          stateText = '审批中';
          break;
        case '1':
          stateText = '已通过';
          break;
        case '2':
          stateText = '已驳回';
          break;
        case '3':
          stateText = '已授权';
          break;
        case '4':
          stateText = '授权撤销';
          break;
      }
      return stateText;
    },
    renderStateColor(state){
      let stateColor = ''
      switch (state){
        case '0':
          stateColor = '#000000';
          break;
        case '1':
          stateColor = '#0055ff';
          break;
        case '2':
          stateColor = '#FF0000';
          break;
        case '3':
          stateColor = '#00FF00';
          break;
        case '4':
          stateColor = '#000000';
          break;
      }
      return stateColor;
    },
    /*
     * 过滤输入框输入的特殊字符
     * */
    formatEnterContent ( value ) {
      let a = Util.clearSpecialChart(value);
      this.searchKey = a
    },
    /**
     * Function    : disabledStartDate
     * Description : 对结束时间进行限制
     * Input       : startValue
     * Return      : None
     */
    disabledStartDate ( startValue ) {
      return startValue && startValue < moment().subtract(1, 'days')
    },
    /**
     * Function    : disabledEndDate
     * Description : 对结束时间进行限制
     * Input       : endValue
     * Return      : None
     */
    disabledEndDate ( endValue ) {
      const startTime = this.startTime
      if (startTime) {
        return startTime.valueOf () >= endValue.valueOf ()
      }
      return  false;
    },

    /**
     * Function    : init
     * Description : 初始化列表
     * Input       : none
     * Return      : none
     */
    init () {
      let searchStartDate = ''
      let searchEndDate = ''
      if (this.endValue === null && this.startValue) {
        searchStartDate = moment (this.startValue)
            .format ('YYYY-MM-DD HH:mm:ss')
            .valueOf ()
      }
      if (this.startValue === null && this.endValue) {
        searchEndDate = moment (this.endValue)
            .format ('YYYY-MM-DD HH:mm:ss')
            .valueOf ()
      }
      if (this.startValue && this.endValue) {
        searchStartDate = moment (this.startValue)
            .format ('YYYY-MM-DD HH:mm:ss')
            .valueOf ()
        searchEndDate = moment (this.endValue)
            .format ('YYYY-MM-DD HH:mm:ss')
            .valueOf ()
      }
      let para = Object.assign ({},
          {name: this.name.trim ()},
          {state:this.applyType},
          {type:'0'},
          {searchStartDate: searchStartDate},
          {searchEndDate: searchEndDate}, this.page)
      this.$store.dispatch ('getAcManagePageListAct', para)
      this.$store.commit ('setAcManageQueryPrams', para)
    },



    /**
     * Function    : delRole
     * Description : 批量删除角色
     * Input       : none
     * Return      : none
     */
    deleteAc (obj) {
      this.$confirm ({
        title: '确认删除【'+obj.name+'】的申请吗？',
        okText: '确定',
        cancelText: '取消',
        onOk: () => {
          let _this = this
          this.$store.dispatch ('deleteAcAct', {recordId: obj.recordId}).then (response => {
            if (response.code === 0) {
              _this.init ()
              this.$message.success (response.message)
            } else {
              this.$message.error (response.message)
            }
          })
        },
      })
    },

    approveAc(acObj){
      this.acDTO = {...acObj}
      this.$refs.approveAc.showEdit(this.acDTO)
    },


    /**
     * Function    : changePage
     * Description : 切换页码
     * Input       : val
     * Return      : none
     */
    changePage ( val ) {
      this.page.currentPage = val
      this.init ()
    },

    /**
     * Function    : changePageSize
     * Description : 切换每页条数
     * Input       : vm
     * Return      : none
     */
    changePageSize ( vm ) {
      this.page.pageSize = vm
      this.page.currentPage = 1
      this.init ()
    },

    /**
     * Function    : handleSubmit
     * Description : 查询按钮
     * Input       : none
     * Return      : none
     */
    handleSubmit () {
      this.page.currentPage = 1
      this.init ()
    },


  },
  created () {
    this.searchKey = this.$route.query.searchKey === undefined ? '' : this.$route.query.searchKey
    this.page.currentPage = this.$route.query.currentPage === undefined ? 1 : this.$route.query.currentPage
    this.page.pageSize = this.$route.query.pageSize === undefined ? 10 : this.$route.query.pageSize
    this.init ()
  },
  mounted () {

  }
}
</script>
